import React, { Component } from 'react';
import {  Flex, WingBlank,WhiteSpace,Icon } from 'antd-mobile';
import {information } from './storeInformation.less';
import {routerRedux} from "dva/router";
import {connect} from "dva";
import storesvg from '../../assets/svg/storesvg.svg';
import rightsvg from "../../assets/img/right.svg";
import meiyuan from "../../assets/svg/meiyuan.svg";
import NoLazyImg from '../../components/NoLazyImg/NoLazyImg';
import {wxShare} from "../../utils/weixinShare";
import {IMAGE_DOMAIN} from "../../utils/common";
class StoreInformation extends Component {


    render() {
        const { data } = this.props;
        const { myStore } = data;

        return (
            <div className={information}>
                <WingBlank>
                    <WhiteSpace size="sm"/>
                    <Flex justify="between" style={{borderBottom:"1px solid #e5e5e5",padding:".2rem 0"}}>
                        <Flex>
                            <Icon className="order_logo" type={storesvg.id}/>
                            <div>我的小店</div>
                        </Flex>
                        <Flex onClick={()=>{
                            this.props.dispatch(routerRedux.push({
                                pathname:`/editMyDistribution`
                            }))
                        }}>
                            <div className="all_order">修改店铺信息</div>
                            <Icon type={rightsvg.id} style={{width:".3rem",height:".3rem",marginLeft:".05rem"}}/>
                        </Flex>
                    </Flex>
                    <WhiteSpace></WhiteSpace>
                    <Flex justify="between" >
                        <Flex onClick={()=>{
                            this.props.dispatch(routerRedux.push({
                                pathname:`/myStore/${myStore.memberId }`
                            }))
                        }} style={{width:"65%"}}>
                            <div className="store_portrait">
                                <NoLazyImg src={myStore.logo ?myStore.logo :"" } style={{width:"100%",height:"100%",borderRadius:"100%"}}></NoLazyImg>
                            </div>
                            <div style={{marginLeft:".3rem",width:"50%"}} >
                                <Flex style={{marginBottom:".2rem"}}>
                                    <div className="store_name">{myStore.name }</div>
                                </Flex>
                                <Flex style={{color:"#999"}}>
                                    <div>提成余额 : </div>
                                    <div>¥ <span>{myStore.accountBalance }</span></div>
                                </Flex>
                            </div>
                        </Flex>
                        <Flex >
                           <div className="tianjia" style={{marginRight:".15rem "}} onClick={()=>{
                               this.props.dispatch(routerRedux.push({
                                   pathname:`/distribution`
                               }))
                           }}>添加</div>
                            {/*<div className="tianjia" onClick={()=>{*/}
                                {/*this.props.dispatch(routerRedux.push({*/}
                                    {/*pathname:`/myStore/${myStore.memberId }`*/}
                                {/*}))*/}
                            {/*}}>分享</div>*/}
                        </Flex>
                    </Flex>
                    <WhiteSpace></WhiteSpace>
                    <Flex justify="between" style={{padding:".2rem 0",borderBottom:"1px solid #e5e5e5"}}>
                        <div style={{color:"#999"}}>推荐人：{myStore.recommendName||"暂无推荐人" }</div>
                        <Flex justify="between">
                            <div className="chanpin" onClick={()=>{
                                this.props.dispatch(routerRedux.push({
                                    pathname:`/myDistribution`
                                }))

                            }}>
                                <div>{myStore.goodNum }</div>
                                <div>小店产品</div>
                            </div>
                            <div style={{color:"#999"}}>|</div>
                            <div className="chanpin" onClick={()=>{
                                this.props.dispatch(routerRedux.push({
                                    pathname:`/myTeam`
                                }))
                            }}>
                                <div>{myStore.fansNum }</div>
                                <div>我的团队</div>
                            </div>
                            <div style={{color:"#999"}}>|</div>
                            <div className="chanpin" onClick={()=>{
                                this.props.dispatch(routerRedux.push({
                                    pathname:`/myDistributionOrder`
                                }))
                            }}>
                                <div>{myStore.storeOrder }</div>
                                <div>小店订单</div>
                            </div>
                        </Flex>
                    </Flex>
                    <WhiteSpace></WhiteSpace>
                    <Flex justify="between" style={{padding:".2rem 0"}}>
                        <Flex justify="between" style={{width:"70%",borderRight:"2px solid #e5e5e5",paddingRight:".6rem"}}>
                            <div>
                                <div style={{marginBottom:".1rem"}}>提成余额</div>
                                <div style={{color:"#ff0036"}}>¥<span style={{fontSize:".3rem"}}>{myStore.accountBalance }</span></div>
                            </div>
                            <div className="tixian" onClick={()=>{
                                this.props.dispatch(routerRedux.push({
                                    pathname:`/putForward`
                                }))
                            }}>去提现</div>
                        </Flex>
                        <Flex justify="around" onClick={()=>{
                            this.props.dispatch(routerRedux.push({
                                pathname:`/reportDetail`
                            }))
                        }}>
                            <Icon type={meiyuan.id} style={{width:".3rem",height:".3rem",marginLeft:".05rem"}}></Icon>
                            <div>详细报表</div>
                        </Flex>
                    </Flex>
                    <WhiteSpace size="sm"/>
                </WingBlank>
            </div>
        );
    }
}

export default StoreInformation;